<!DOCTYPE html>
<html>
<head>
    @include("/include/_header.html", {'title':'故障记录'}){}
    <meta charset="utf-8">
    <title>全端复杂组合</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <!--    <link rel="stylesheet" href="${ctxPath}/layui/css/layui.css" media="all">-->
    <!--    <script type="text/javascript" src="${ctxPath}/jquery/js/jquery.min.js"></script>-->
    <!--    <script type="text/javascript" src="${ctxPath}/layui/layui.js"></script>-->
    <script type="text/javascript" src="${ctxPath}/someexternaljs/moment-with-locales.min.js"></script>

</head>
<body>
<div class="layui-fluid">
    <div class="layui-row">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-header">查询</div>
                <div class="layui-card-body">
                    <div class="layui-form">
                        <div class="test-table-reload-btn" style="margin-bottom: 10px;">
                            任务类型：
                            <div class="layui-inline">
                                <select id="workmodeinput" name="workmode" lay-verify="">
                                    <option value=''>全部模式</option>
                                    <option value="normal">手动</option>
                                    <option value="automatic">自动</option>
                                </select>
                            </div>
                            天车编号：
                            <div class="layui-inline">
                                <select id="craneTypeInput" name="craneType" lay-verify="">
                                    <option value="">全部</option>
                                    <option value="2#横移">2#</option>
                                    <option value="3#横移">3#</option>
                                    <option value="4#横移">4#</option>
                                    <option value="5#横移">5#</option>
                                    <option value="CD0">CD0</option>
                                    <option value="11C南">11C南</option>
                                    <option value="11C北">11C北</option>
                                </select>
                            </div>
                            日期：
                            <div class="layui-inline">
                                <input class="layui-input" name="timeBegin" id="timeBegin" placeholder="请选择开始时间"
                                       autocomplete="off" style="width: 150px;">
                            </div>
                            到：
                            <div class="layui-inline">
                                <input class="layui-input" name="timeEnd" id="timeEnd" placeholder="请选择结束时间"
                                       autocomplete="off" style="width: 150px;">
                            </div>
                            故障类型:
                            <div class="layui-inline">
                                <input class="layui-input" name="fuzzyMapping" id="fuzzyMappingInput"
                                       placeholder="请输入查询的故障类型"
                                       autocomplete="off" style="width: 180px;">
                            </div>
                            <div class="layui-row" style="margin-top: 10px;">
                                <div class="layui-col-md2 layui-col-md-offset10">
                                    <button id="btnSearch" class="layui-btn">搜索</button>
                                    <button id="exportRecord" class="layui-btn layui-btn-primary">导出</button>
                                    <!--                  <button id="btnReset" class="layui-btn">重置</button>-->
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-row layui-col-sm24 layui-col-md12">
            <div class="layui-row layui-col-sm12 layui-col-md6 ">
                <div class="layui-card">
                    <div class="layui-card-header">故障记录</div>
                    <div class="layui-card-body">

                        <blockquote class="layui-elem-quote"><h3>故障总数：<span id='total'></span></h3></blockquote>
                        <table class="layui-hide" id="fault-table" lay-filter="fault-table"></table>
                        <!-- 表格操作按钮 -->


                    </div>
                </div>
            </div>
            <div class="layui-row layui-col-sm12 layui-col-md6 ">
                <div class="layui-card">
                    <div class="layui-card-header">故障分布</div>
                    <div class="layui-card-body">
                        <div style="margin-top: 20px;padding: 10px">
                            <!--                            <div>-->
                            <!--                            <button id="exportExcel"-->
                            <!--                                    class="layui-btn layui-btn-radius layui-btn-normal">导出-->
                            <!--                            </button>-->
                            <!--                            </div>-->
                            <div id="faultChart" style="width : 800px;height: 700px"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- 表格操作按钮 -->

<div id="openShowBox" style="display: none; padding: 10px;">
    <table id="openShowTaskDetails" lay-filter="openProductTable">
        <h3 style="text-align: center">故障信息</h3>
    </table>
</div>

@include("/include/_container.html", {'js':'/baotou-steel/NormalManage/FaultRecord.js'}){}
</body>
</html>